<nav class="fixed-nav-box bg">
  <div class="nav-wrapper">
    <div>
      <a href="javascript:;" class="hoverLink" routerLink="/monitorShop"><i class="fa fa-angle-left pr5"></i>{{'返回'|translate}}</a>
    </div>
  </div>
</nav>
<div class="page-container">
  <div class="container pt72">
    <nav mat-tab-nav-bar>
      <a mat-tab-link routerLink="sell" routerLinkActive #rla1="routerLinkActive" [active]="rla1.isActive">{{'销售趋势' |translate}}</a>
      <a mat-tab-link routerLink="shop" routerLinkActive #rla2="routerLinkActive" [active]="rla2.isActive">{{'店铺分析'|translate}}</a>
      <a mat-tab-link routerLink="category" routerLinkActive #rla3="routerLinkActive" [active]="rla3.isActive">{{'类别分析'|translate}}</a>
      <a mat-tab-link routerLink="product" routerLinkActive #rla4="routerLinkActive" [active]="rla4.isActive">{{'宝贝列表'|translate}}</a>
      <a mat-tab-link routerLink="doubleProduct" routerLinkActive #rla5="routerLinkActive" [active]="rla5.isActive" class="red-text" >{{'双11预售宝贝' |translate}}</a>
    </nav>


    <mat-card class="mini">
      <mat-card-header>
        <mat-card-title>{{'品牌' |translate}}: <b>{{brandInfo.brandName}}</b></mat-card-title>
        <b fxFlex class="right-align">{{'更新于'|translate}}{{brandInfo.date | dateFormat}}</b>
      </mat-card-header>
      <mat-card-content>
        <table class="centered responsive-table small">
          <thead>
            <tr>
              <th>{{'品牌' |translate}}</th>
              <th>{{'类目' | translate}}</th>
              <th class="text-overflow" [title]="'日销售额' |translate">{{'日销售额' |translate}}</th>
              <th class="text-overflow" [title]="'日销售量' |translate">{{'日销售量' |translate}}</th>
              <th class="text-overflow" [title]="'近30天销售额' |translate">{{'近30天销售额' |translate}}</th>
              <th class="text-overflow" [title]="'近30天销售量' |translate">{{'近30天销售量' |translate}}</th>
              <th class="text-overflow" [title]="'动销店铺数' |translate">{{'动销店铺数' |translate}}</th>
              <th class="text-overflow" [title]="'动销宝贝数' |translate">{{'动销宝贝数' |translate}}</th>
              <th class="red-text text-overflow" [title]="'双11预售定金' |translate" *ngIf="brandDoble.sellAmount>0">{{'双11预售定金' |translate}}</th>
              <th class="red-text text-overflow" [title]="'双11预售量' |translate" *ngIf="brandDoble.sellAmount>0">{{'双11预售量' |translate}}</th>
              <th class="red-text text-overflow" [title]="'双11预售额' |translate" *ngIf="brandDoble.sellAmount>0">{{'双11预售额' |translate}}</th>
              <th>{{'监控' |translate}}</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td><b>{{brandInfo.brandName}}</b></td>
              <td><b>{{brandInfo.categoryName | categoryName}}</b></td>

              <td [matTooltip]="brandInfo.sellMoney |number:'1.0-2'"><span class="tm-yen">¥</span>{{brandInfo.sellMoney|bigNum}}</td>

              <td [matTooltip]="brandInfo.sellAmount |number:0">{{brandInfo.sellAmount|bigNum}}</td>

              <td [matTooltip]="brandInfo.monthSellMoney |number:'1.0-2'"><span class="tm-yen">¥</span>{{brandInfo.monthSellMoney|bigNum}}</td>

              <td [matTooltip]="brandInfo.monthSellAmount |number:0">{{brandInfo.monthSellAmount|bigNum}}</td>
              <td>{{brandInfo.shopNum | number:'1.0'}}</td>
              <td>{{brandInfo.productNum | number:'1.0'}}</td>
              <td *ngIf="brandDoble.sellAmount>0" [matTooltip]="brandDoble.dingJin">
                <span class="tm-yen">¥</span>{{brandDoble.dingJin | number:0}}
              </td>
              <td  *ngIf="brandDoble.sellAmount>0" [matTooltip]="brandDoble.sellAmount |number:0">
                {{brandDoble.sellAmount | bigNum}}
              </td>
              <td *ngIf="brandDoble.sellAmount>0" [matTooltip]="brandDoble.sellMoney | number:0">
                <span class="tm-yen">¥</span>{{brandDoble.sellMoney | bigNum}}
              </td>
              <td>
                <monitor-slide-toggel type="brand" [data]="brandInfo" [checked]="instest"></monitor-slide-toggel>
              </td>
            </tr>
          </tbody>
        </table>
      </mat-card-content>
    </mat-card>
    <en-mark></en-mark>
    <router-outlet></router-outlet>
  </div>
</div>
